<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":"
            + request.getServerPort() + path + "/";
%>
<html>
<head>
    <base href="<%=basePath%>"/> <!-- 设置页面的基础路径，页面所有资源引入和页面跳转都基于bathPath -->

    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,recipe-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
</head>
<body>
<article class="page-container">
    <!-- form的action中根据判断共享对象recipe是否为空，来指定表单提交的url -->
    <form class="form form-horizontal" action="${empty recipe ? 'recipe/insert.do' : 'recipe/update.do'}" method="post" id="recipeForm">
        <!-- 在更新处方费信息的环境下把recipeId隐藏提交给后台 -->
        <input type="hidden" value="${recipe.recipeId }" name="recipeId" />

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>处方费名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <!-- 在更新处方费信息的环境下锁定处方费名称信息，不能更改 -->
                <input type="text" class="input-text" ${recipe != null ? 'disabled' : '' } value="${recipe.recipeName }" placeholder="请输入处方费名称" id="recipeName" name="recipeName">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>处方费类型：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <span class="select-box">
                    <select name="recipeType" class="select">
                        <option value="">请选择</option>
                        <c:forEach var="dictionary" items="${dictionaries}">
                            <option ${recipe.recipeType == dictionary.dictionaryId ? 'selected' : ''}
                                    value="${dictionary.dictionaryId}">${dictionary.dictionaryName}</option>
                        </c:forEach>
                    </select>

                </span>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>处方金额：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="${recipe.recipeMoney }" placeholder="请输入处方金额" id="recipeMoney" name="recipeMoney">
            </div>
        </div>

        <div class="row cl">
            <div class="col-sm-1 col-sm-offset-3">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
            </div>
            <div class="col-sm-1 col-sm-offset-1">
                <input class="btn btn-warning radius" type="reset" value="&nbsp;&nbsp;重置&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer /作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/webuploader/0.1.5/webuploader.min.js"></script>
<script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript" src="lib/ueditor/1.4.3/ueditor.config.js"></script>
<script type="text/javascript" src="lib/ueditor/1.4.3/ueditor.all.min.js"> </script>
<script type="text/javascript" src="lib/ueditor/1.4.3/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
    /* 使用jquery-validation技术进行表单提交前的校验 */
    $().ready(function(){
        /* 在键盘按下并释放及表单提交时验证 */
        $("#recipeForm").validate({
            // 校验规则
            rules:{
                recipeName:{
                    required:true,
                    remote:{  // 通过异步验证来判断处方费名是否重复，返回ture或false。达到局部刷新的效果
                        url:"recipe/checkRecipeName.do",
                        type:"post",
                        dataType:"json",
                        data:{
                            recipeName:function(){
                                return $("#recipeName").val();
                            }
                        }
                    }
                },
                recipeType:{
                    required:true
                },
                recipeMoney:{
                    required:true
                }
            },

            //错误提示
            messages:{
                recipeName:{
                    required:"处方费名称不能为空",
                    remote:"该处方费名称已经被使用"
                },
                recipeType:{
                    required:"处方费类型不能为空"
                },
                recipeMoney:{
                    required:"处方金额不能为空"
                }
            },

            /* 校验成功后的处理：
             *		1. 函数中的form就是上面表单的原始DOM对象
             * 		2. 原生对象-->Jquery对象：$(原生DOM对象)
             * 		3. Jquery对象-->原生对象: Jquery对象[0]
             *
             */
            submitHandler:function(form){
                $(form).ajaxSubmit(function(respData){
                    console.log(respData);
                    // 添加完毕后的提示
                    layer.msg(respData.msg,{icon:respData.code,time:2000},function(){
                        // 添加成功后
                        if(respData.code == 1){
                            // 刷新父页面表格
                            parent.refreshTable();
                            // 通过父页面关闭模态窗口
                            parent.layer.closeAll();
                        }
                    });
                });
            }
        });
    });
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
